@mixin respond($breakpoint) {
  @if map-has-key($grid-breakpoints, $breakpoint) {
    @media (min-width: #{map-get($grid-breakpoints, $breakpoint)}) {
      @content;
    }
  } @else {
    @warn 'No value could be retrieved from `#{$breakpoint}`. Please make sure it is defined in `$breakpoints` map.';
  }
}

@mixin make-container($gutter-width: $grid-gutter-width) {
  width: 100%;
  padding-right: ($grid-gutter-width / 2);
  padding-left: ($grid-gutter-width / 2);
  margin-right: auto;
  margin-left: auto;
}

@mixin make-container-max-widths($max-widths: $container-max-widths) {
  @each $breakpoint, $container-max-width in $container-max-widths {
    @include respond($breakpoint) {
      max-width: $container-max-width;
    }
  }
}
